<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>EX-admin 数据添加页面</title>
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon">
    <link rel="stylesheet" href="./css/font.css">
    <link rel="stylesheet" href="./css/xadmin.css">

</head>

<body>
<div class="x-body">
    <form class="layui-form">
        <div class="layui-form-item">
            <label for="username" class="layui-form-label">
                <span class="x-red">*</span>
                登录名
            </label>
            <div class="layui-input-inline">
                <input type="text" id="username" name="username" required="" lay-verify="required" autocomplete="off" class="layui-input">
            </div>
        
        </div>
        <div class="layui-form-item">
            <label for="phone" class="layui-form-label">
                <span class="x-red">*</span>
                手机
            </label>
            <div class="layui-input-inline">
                <input type="text" id="phone" name="phone" required="" lay-verify="phone" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">*</span>
                可以使用手机号登录
            </div>
        </div>
        <div class="layui-form-item">
            <label for="L_email" class="layui-form-label">
                <span class="x-red">*</span>
                邮箱
            </label>
            <div class="layui-input-inline">
                <input type="text" id="L_email" name="email" required="" lay-verify="email" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">
                <span class="x-red">*</span>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">
                <span class="x-red">*</span>
                角色
            </label>
            <div class="layui-input-block">
                <input type="checkbox" name="role[0]" lay-skin="primary" title="超级管理员">
                <input type="checkbox" name="role[1]" lay-skin="primary" title="编辑人员">
                <input type="checkbox" name="role[2]" lay-skin="primary" title="宣传人员">
            </div>
        </div>
        <div class="layui-form-item">
            <label for="L_pass" class="layui-form-label">
                <span class="x-red">*</span>密码
            </label>
            <div class="layui-input-inline">
                <input type="password" id="L_pass" name="pass" required="" lay-verify="pass" autocomplete="off" class="layui-input">
            </div>
            <div class="layui-form-mid layui-word-aux">
                6到16个字符
            </div>
        </div>
        <div class="layui-form-item">
            <label for="L_repass" class="layui-form-label">
                <span class="x-red">*</span>确认密码
            </label>
            <div class="layui-input-inline">
                <input type="password" id="L_repass" name="repass" required="" lay-verify="repass" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label for="L_repass" class="layui-form-label"></label>
            <button class="layui-btn" lay-filter="add" lay-submit="">
                增加
            </button>
        </div>
    </form>
</div>

<script type="text/javascript" src="./lib/jquery.min.js "></script>
<script type="text/javascript" src="./lib/layui/layui.js"></script>
<script type="text/javascript" src="./js/xadmin.js"></script>
<script type="text/javascript" src="./lib/vue/vue.js"></script>
<script>
	layui.use([
		'form', 'layer'
	], function () rt{
		var $ = layui.jquery;
		var form = layui.form,
			layer = layui.layer;

		//自定义验证规则
		form.verify({
			nikename: function (value) {
				if (value.length < 5) {
					return '昵称至少得5个字符啊';
				}
			},
			pass: [
				/(.+){6,12}$/, '密码必须6到12位'
			],
			repass: function (value) {
				if ($('#L_pass').val() != $('#L_repass').val()) {
					return '两次密码不一致';
				}
			}
		});

		//监听提交
		form.on('submit(add)', function (data) {
			console.log(data);
			//发异步，把数据提交给php
			layer.alert("数据添加成功", {
				icon: 6
			}, function () {
				//关闭弹窗
				x_admin_close();

			});
			return false;
		});

	});
</script>

</body>

</html>